<template>
  <div>
    <Header :left="true" leftText="返回" title="设备管理" />
    <!-- <Row style="margin-top: 160px;">
      <div class="container dwo">
        <div class="card">
          <div class="text" @click="alerts">用户名：{{user.nickName}}</div>
          <div class="text">班 组：{{user.classes}}</div>
          <div class="text">部 门：{{user.depart}}</div>
        </div>
      </div>
    </Row>-->
    <Notice-bar :scrollable="false" text="TIPS：点击下方二维码进行扫描设备哦" />
    <Row style="margin-top: 280px">
      <div class="container dwo">
        <div class="card_under">
          <div class="card_scanner">
            <Icon name="scan" color="#FFFFFF" size="8rem" style="margin: 10% 0" @click="showScanner" />
            <br />
            <span class="text_scan">扫描设备码</span>
          </div>
        </div>
      </div>
    </Row>
  </div>
</template>
<script>
import { Icon, Button, Toast, NoticeBar, Row, Dialog } from "vant";
import Header from "@/components/header.vue";
import { storage, memory } from "@/libs/utils";
import { _httpClient } from "@/libs/api";

export default {
  name: "equip_manage",
  components: {
    Button,
    Toast,
    Header,
    NoticeBar,
    Icon,
    Row,
    [Dialog.Component.name]: Dialog.Component,
  },
  data() {
    return {
      show: true,
      user: {
        classes: "",
        nickName: "",
        depart: "",
        site: null,
      },
      params: {
        mnType: "",
        eqStatus: "",
      },
    };
  },
  created() {
    let user = JSON.parse(storage.get("user"));
    this.user = user;
    this.params = api.pageParam;
    api.requestPermission(
      {
        list: ["camera", "microphone", "storage"],
      },
      function (ret, err) { }
    );

    // try {
    //   var manageStorage = api.require('manageStorage');
    //   manageStorage.requestAllFilePermission({
    //   }, function (ret) {
    //     // api.alert({
    //     //   msg: JSON.stringify(ret)
    //     // })
    //   });
    // } catch {

    // }
    
  },
  methods: {
    alerts() {
      alert(JSON.stringify(this.params));
    },
    //打开扫描
    showScanner() {
      let _this = this;
      if (api.deviceName.toLowerCase() == "huawei" || api.deviceName.toLowerCase() == "honor") {
        // var QRScan = api.require("QRScan");
        // QRScan.customizedScanner(
        //   {
        //     rect: {
        //       x: 15, //（可选项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认：0
        //       y: 0, //（可选项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认：0
        //       w: 320, //（可选项）数字类型；模块的宽度；支持设置'auto'；默认：所属的 Window 或 Frame 的宽度
        //       h: 480, //（可选项）数字类型；模块的高度；支持设置'auto'；默认：所属的 Window 或 Frame 的高度
        //     },
        //     rectOfInterest: {
        //       x: 64, //（可选项）数字类型；扫码识别区域左上角的 x 坐标（相对于扫码区rect）；默认：0
        //       y: 65, //（可选项）数字类型；扫码识别区域左上角的 y 坐标（相对于扫码区rect）；默认：0
        //       w: 250, //（可选项）数字类型；扫码识别区域的宽度；默认：扫码区rect的宽度
        //       h: 250, //（可选项）数字类型；扫码识别区域的高度；默认：扫码区rect的高度
        //     },
        //     //tipString:'放入框内扫码',
        //     maskColor: "rgba(0,0,0,0.5)",
        //     scanLine: {
        //       color: "#00FF00",
        //       thickness: 2,
        //     },
        //     marginB: 30,
        //     formatType: "ALL",
        //   },
        //   function (ret) {
        //     if (ret) {
        //       _this.queryTask({
        //         body: {
        //           equipCode: ret.result,
        //           siteKey: _this.user.site,
        //           eqStatus: _this.params.eqStatus,
        //           taskType: _this.params.mnType,
        //         },
        //       });
        //     }
        //   }
        // );
        //    QRScan.closeCustomizedScanner();

        var zyHmsScan = api.require('zyHmsScan');
        var param = {
          //returnAll:true
        };
        zyHmsScan.openDefaultView(param, function (ret) {
          //_this.addBarCode(ret.result);
          _this.queryTask({
            body: {
              equipCode: ret.result,
              siteKey: _this.user.site,
              eqStatus: _this.params.eqStatus,
              taskType: _this.params.mnType,
            },
          });
          //api.alert({ msg: JSON.stringify(ret) });
        });

      } else {
        var FNScanner = this.$ac.require("FNScanner");
        FNScanner.openScanner(
          {
            autorotation: true,
          },
          function (ret, err) {
            if (ret) {
              if (ret.eventType == "success" && ret.content != "") {
                _this.queryTask({
                  body: {
                    equipCode: ret.content,
                    siteKey: _this.user.site,
                    eqStatus: _this.params.eqStatus,
                    taskType: _this.params.mnType,
                  },
                });
              }
            } else {
              alert(JSON.stringify(err));
            }
          }
        );
      }
    },
    async queryTask(data) {
      alert(JSON.stringify(data));
      Toast.loading({
        mask: true,
        forbidClick: true,
        duration: 0,
        message: "请稍等...",
      });
      let that = this;
      try {
        let res = await _httpClient.post(
          _httpClient.getApiPrefix() + "/equip/check/isExist",
          data
        );
        Toast.clear();
        if (res.code === 200) {
          if (res.taskItemList) {
            //跳转到点检页面
            this.$ac.openWin({
              name: "equip_check",
              url: "./demos-equip_check.html",
              pageParam: {
                equipCode: data.body.equipCode,
                taskItemList: res.taskItemList,
                taskFileList: res.taskFileList,
              },
            });
          } else {
            that.$ac.confirm(
              {
                title: "创建任务",
                msg: "没有找到相关任务，请问需要创建吗？",
                buttons: ["确定", "取消"],
              },
              function (ret, err) {
                if (ret.buttonIndex == 1) {
                  //创建任务
                  that.creatTask(data);
                }
              }
            );
          }
        } else {
          Toast.fail(res.msg);
        }
      } catch (e) {
        Toast.fail(JSON.stringify(e));
      }
    },
    async creatTask(data) {
      Toast.loading({
        mask: true,
        forbidClick: true,
        duration: 0,
        message: "请稍等...",
      });
      let res = await _httpClient.post(
        _httpClient.getApiPrefix() + "/equip/check/create",
        data
      );
      Toast.clear();
      if (res.code === 200) {
        if (res.taskItemList) {
          Toast("创建成功！");
          this.$ac.openWin({
            name: "equip_check",
            url: "./demos-equip_check.html",
            pageParam: {
              equipCode: data.body.equipCode,
              taskItemList: res.taskItemList,
              taskFileList: res.taskFileList,
            },
          });
        } else {
          Toast("创建失败，原因：设备任务项暂无数据，请添加数据后重试！");
        }
      }
    },
  },
};
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body {
  font-family: "Open Sans", sans-serif;
}

.container.dwo {
  display: flex;
  justify-content: center;
  align-items: center;
}

.card {
  position: absolute;
  height: 130px;
  width: 95%;
  margin: auto;
  background: #ffffff;
  border-radius: 25px;
  box-shadow: 0 10px 50px rgba(0, 0, 0, 0.3);
}

.card_under {
  position: absolute;
  height: 350px;
  width: 95%;
  margin: auto;
  background: #ffffff;
  border-radius: 25px;
  box-shadow: 0 10px 50px rgba(0, 0, 0, 0.3);
}

.card_scanner {
  text-align: center;
  position: absolute;
  height: 160px;
  width: 50%;
  margin: 25% 25%;
  background: rgba(35, 180, 237, 0.8);
  border-radius: 25px;
  box-shadow: 0 10px 50px rgba(0, 0, 0, 0.3);
}

.content {
  padding: 0 20px 0 35px;
  width: 100%;
  margin-left: 50px;
  opacity: 0;
  transition: 0.6s;
}

.content .title {
  font-size: 30px;
  font-weight: 700;
  color: #0d0925;
  margin: 0 0 20px 0;
}

.text {
  font-size: 19px;
  color: #4e4a67;
  margin: 8px auto auto 20px;
  line-height: 1.5em;
  text-align: justify;
}

.text_scan {
  font-size: 18px;
  color: #4e4a67;
  margin: 18px auto auto auto;
  line-height: 1.5em;
  text-align: justify;
}
</style>
